<script lang="ts" setup>
import { DownloadType } from "../../../utils/ts/download";
const { item } = defineProps<{ item: DownloadType }>();
</script>
<template>
  <div class="flex shadow pt-7 pr-8 pb-4 pl-4 rounded bg-white mb-5 mt-20">
    <div class="w-43 mr-5">
      <img :src="item.img" alt="" />
    </div>
    <div class="flex flex-col">
      <p class="font-bold text-2xl mb-3">
        {{ item.name }}
      </p>
      <p class="text-sm text-gray-500 mb-2">
        {{ item.desc }}
      </p>
      <div
        class="flex font-bold text-lg rounded text-white but justify-center cursor-pointer"
      >
        {{ item.but }}
      </div>
    </div>
  </div>
</template>
<style lang="scss" scoped>
.but {
  background: linear-gradient(#54b891, #22a53d);
}
.shadow {
  box-shadow: 0 4px 8px 0 rgb(0 0 0 / 30%);
}
</style>
